<template>
	<view class="homeLayout">
		<view class="banner">
			<swiper circular indicator-dots indicator-color='grey' indicator-active-color="white" autoplay>
				<swiper-item
				 v-for="(item,index) in 3">
					<image src="../../common/image/banner2.jpg" mode="aspectFill"></image>
				</swiper-item>
			</swiper>
		</view>
		<view class="notice">
			<div class="left">
				<uni-icons type="sound-filled" size="30" color="#28b389"></uni-icons>
				<text class="text">公告</text>
			</div>
			<div class="center">
				<swiper :autoplay="true" :duration="1500" interval="2000" vertical circular> 
					<swiper-item v-for="items in 3" >
						<view class="swiper-item">文2da d都是对的撒大声地撒大萨达wd a d本内容</view>
					</swiper-item>
			
				</swiper>
			</div>
			<div class="right">
				<uni-icons type="right"  size="20"></uni-icons>
			</div>
		</view>
	</view>
</template>

<script setup>
	
</script>

<style lang="scss">
	.homeLayout{
		
		.banner{
			width: 750rpx;
			padding: 30px 0;
			swiper{
				width: 750rpx;
				height: 340rpx;
				&-item{
				width: 100%;
				padding: 0 30rpx;
					height: 100%;
					image{
						width: 100%;
					border-radius: 10rpx;
						height: 100%;
					}
				}
			}
		}
		.notice{
			display: flex;
			margin: 0 30rpx;
			width: 690rpx;
			line-height: 80rpx;
			// padding: 0 30rpx;
			// justify-content: space-between;
			// align-items: center;
			background-color: #eee;
			height: 80rpx;
			border-radius: 80rpx;
			.left{
				display: flex;
				justify-content: center;
				align-items: center;
				width: 140rpx		
				}
				.text{
					color: #28b389;
					font-weight: 600;
					font-size: 28rpx
				}
			.right{
				width: 70rpx;		
				display: flex;
				justify-content: center;
				align-items: center;
				
			}
			.center{
				// width: %;
				// height: 50rpx;
				// overflow: hidden;
				swiper{
					height: 100%;
					.swiper-item{
						height: 100%;
						font-size: 30rpx;
						color: #666;
						overflow: hidden;
						white-space: nowrap;
						text-overflow: ellipsis;
					}
				}
				flex: 1;
			}
		}
	}
</style>
